<!--告警日志的统计页面-->
<script>
    // checkRole("sysAuditor");
    window.location.hash="#warnStatistical";
</script>

<div style="margin-top: 20px">

    <div class="op">
    <div class="layui-form-item">
        <div class="layui-inline">
            <label class="layui-form-label">开始时间：</label>
            <div class="layui-input-inline">
                <input type="date" name="from" id="from" lay-verify="date" placeholder="yyyy-MM-dd"
                       autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline" style="margin-left: 0px">
            <label class="layui-form-label">结束时间：</label>
            <div class="layui-input-inline">
                <input type="date" name="to" id="to" lay-verify="date" placeholder="yyyy-MM-dd"
                       autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">用户名：</label>
            <div class="layui-input-inline">
                <input type="text" name="username" id="username" maxlength="16" lay-verify="title" autocomplete="off"
                       placeholder="请输入用户名" class="layui-input">
            </div>
        </div>
        <div class="layui-inline">
            <label class="layui-form-label">告警事件类型：</label>
            <div class="layui-input-inline" style="width: 100px">
                <select id="warnType" class="mySelect">
                    <option value=""></option>
                    <option value="0">账号异常</option>
                    <option value="1">越权访问</option>
                </select>
            </div>
        </div>
        <button class="layui-btn layui-btn-normal" id="wQueryBtn"><i class="fa fa-search"></i>&nbsp;查询</button>

    </div>
</div>
    <!-- 为 ECharts 准备一个具备大小（宽高）的 DOM -->
    <div id="myArea" style="width: 1400px;height:650px;margin: 40px auto"></div>
</div>




<script type="text/javascript">
    var myChart = null;

    var dataInfo={
        fromTime:"",
        toTime:"",
        warnType:"",
        name:""
    };

    initChart();
    getStatisticalData();
    
    /**
     * 统计按钮事件
     * */
    $("#wQueryBtn").live("click",function () {
        dataInfo.name=$("#username").val();
        dataInfo.fromTime=$("#from").val();
        dataInfo.toTime=$("#to").val();
        dataInfo.warnType=$("#warnType").val();

        //用户名处理
        if( dataInfo.name.trim()!="" && !checkLogUsername(dataInfo.name)){
            alert("用户名不能超过16位，且不包含除出下划线和减号以外的特殊字符");
            $("#username").val("");
            return;
        }
        //时间处理
        if(!isNull(dataInfo.fromTime)&&!isNull(dataInfo.toTime)) {
            if (compareFromAndTo(dataInfo.fromTime ,dataInfo.toTime)){
                dataInfo.fromTime = dataInfo.fromTime .replace(/-/g, "/") + " 00:00:00";
                dataInfo.toTime = dataInfo.toTime.replace(/-/g, "/") + " 23:59:59";
            }else {
                alert("时间区间先后存在问题!");
            }
        }else if(!isNull(dataInfo.fromTime )){
            dataInfo.fromTime  = dataInfo.fromTime .replace(/-/g, "/") + " 00:00:00";
        }else if(!isNull(dataInfo.toTime)){
            dataInfo.toTime = dataInfo.toTime.replace(/-/g, "/") + " 23:59:59";
        }

        getStatisticalData();

    });

    /**
     * 初始化echart
     * */
    function initChart() {
        myChart = echarts.init(document.getElementById('myArea'),"shine");
        var option = {
            title: {
                textStyle: {
                    fontSize: 25,
                    fontWeight: 'bolder',
                    color: '#333'          // 主标题文字颜色
                },
                subtextStyle: {
                    //fontSize: 12,
                    color: '#aaa'          // 副标题文字颜色
                },
                text: '告警日志统计信息(单位:条)',
                // subtext:'起始时间:'+fTime +"\n\n"
                //     +"终止时间:"+tTime+"\n\n"
                //     +"用户名: "+name+"\n\n"
                //     +"事件类型:"+eventCode,
            },
            tooltip: {
                trigger:'axis',
            },
            legend: {
            },
            xAxis: {
                data: [],
                axisLabel: {
                    textStyle: {
                        color: '#000',
                        fontSize: '14'
                    },
                }
            },
            yAxis: {
                axisLabel: {
                    textStyle: {
                        color: '#000',
                        fontSize: '14'
                    },
                }
            },
            series: [{
                type: 'bar',
                data: [],
            }],
            dataZoom: [{
                id: 'dataZoomX',
                //startValue: '2014-06-01',
                show: true,
                start: 100,
                end: 80
            },{
                type: 'inside'
            }],
        };

        myChart.setOption(option);
    }

    /**
     * 更新数据
     * */
    function updateOption(option) {
        myChart.setOption(option);

    }

    /**
     * 请求数据
     * */
    function getStatisticalData() {
        isOnline("sysAuditor");
        $.ajax({
            url:HOST.concat("/wStatiscal?token="+config.token),
            type:"get",
            dataType:"json",
            data:{
                name:dataInfo.name,
                fromTime:dataInfo.fromTime,
                toTime:dataInfo.toTime,
                warnType:dataInfo.warnType
            },
            success:function (res) {
                // console.log(res);
                if(res.meta.state=="success"){
                    var array=res.data.dataArray;
                    var dateSet=new Set();//将日志按照记录的日期进行归类
                    var warnMap_0=new Map();//账号异常
                    var warnMap_1=new Map();//越权访问

                    for(var i=0;i<array.length;i++){
                        var temp=array[i];
                        //日期集合
                        dateSet.add(temp.date);
                        if(temp.warningType=="账号异常"){
                            warnMap_0.set(temp.date,temp.totalNum);
                        }else if(temp.warningType=="越权访问"){
                            warnMap_1.set(temp.date,temp.totalNum);
                        }
                    }

                    //存放每日日志总记录数的数据
                    var resNumArray=[];
                    //日期数组
                    var resDateArray=Array.from(dateSet);
                    for(var k=0;k<resDateArray.length;k++){
                        //计算当日总记录数
                        var num1=0;//账号异常的记录数
                        var num2=0;//越权访问的记录数
                        var sum=0;
                        var tp=resDateArray[k];
                        //取当日账号异常的数据
                        if(warnMap_0.get(tp)!=undefined){
                            num1=warnMap_0.get(tp);
                        }
                        //取当日越权访问的数据
                        if(warnMap_1.get(tp)!=undefined){
                            num2=warnMap_1.get(tp);
                        }
                        sum=num1+num2;//总数
                        resNumArray.push(sum);
                    }
                    var str=res.data;
                    var fTime;
                    var tTime;
                    var warnType;
                    var name;
                    if(str.fromTime==""){
                        fTime="任意";
                    }else{
                        fTime=(str.fromTime).substr(0,10);
                    }

                    if(str.toTime==""){
                        tTime="任意";
                    }else{
                        tTime=(str.toTime).substr(0,10);
                    }

                    if(str.name==""){
                        name="任意";
                    }else{
                        name=str.name;
                    }

                   if(str.warnType==0||str.warnType=="0"){
                        warnType="账号异常";
                    }else if(str.warnType==1||str.warnType=="1"){
                        warnType="越权访问";
                    } else{
                        warnType="任意";
                    }
                        var option={
                        tooltip : {
                            trigger: 'axis',
                            formatter:function (params) {
                                //console.log(params);
                                var dateTime=params[0].name;
                                var totalNum=params[0].value;
                                var num1=0;
                                var num2=0;
                                if(warnMap_0.get(dateTime)!=undefined){
                                    num1=warnMap_0.get(dateTime);
                                }else{
                                    num1=0;
                                }

                                if(warnMap_1.get(dateTime)!=undefined){
                                    num2=warnMap_1.get(dateTime);
                                }else{
                                    num2=0;
                                }
                                var msg= '日志日期：'+dateTime;
                                return [
                                    msg,
                                    '日志总数：'+totalNum+'条',
                                    '包含：',
                                    '账号异常日志：'+num1+'条',
                                    '越权访问日志：'+num2+'条'
                                ].join('<br>')
                            }
                        },
                        title: {
                            textStyle: {
                                fontSize: 30,
                                fontWeight: 'bolder',
                                color: '#333'          // 主标题文字颜色
                            },
                            subtextStyle: {
                                fontSize: 16,
                                color: 'rgba(30,144,255,1)'          // 副标题文字颜色 #aaa
                            },
                            text: '告警日志统计信息(单位:条)',
                            subtext:'起始时间:'+fTime +"\n\n"
                                +"终止时间:"+tTime+"\n\n"
                                +"用户名: "+name+"\n\n"
                                +"告警类型:"+warnType,
                        },
                        yAxis:{
                            axisLabel: {
                                textStyle: {
                                    color: '#000',
                                    fontSize: '14'
                                },
                            }
                        },
                        xAxis:{
                            data:resDateArray,
                            axisLabel: {
                                textStyle: {
                                    color: '#000',
                                    fontSize: '12'
                                },
                            }
                        },
                         grid:{
                             //show:true,
                             left:200,
                             top:80,
                             //borderWidth:2
                         },
                        series: [{
                            // name: '条数',
                            type: 'bar',
                            barWidth : 40,//柱图宽度
                            data: resNumArray,
                            itemStyle: {
                                normal: {
                                    label: {
                                        show: true, //开启显示
                                        position: 'top', //在上方显示
                                        textStyle: { //数值样式
                                            color: '#999999',
                                            fontSize: 14
                                        }
                                    }
                                }
                            },

                        }],
                        dataZoom: [
                            {
                                id: 'dataZoomX',
                            },{
                                type: 'inside',

                            }],
                    };
                    updateOption(option);
                }else if(res.meta.state=="failed"){
                    var option = {
                        title: {
                            //left:'center',
                            textStyle: {
                                fontSize: 30,
                                fontWeight: 'bolder',
                                color: '#333'          // 主标题文字颜色
                            },
                            subtextStyle: {
                                fontSize: 16,
                                color: 'rgba(255,0,0,1)'          // 副标题文字颜色 #aaa
                            },
                            text: '告警日志统计信息(单位:条)',
                            subtext:'无相关记录'
                        },
                        tooltip: {},
                        legend: {
                            // data: ['条数']
                        },
                        xAxis: {

                        },
                        yAxis: {
                            data:[],
                        },
                        series: [{
                            type: 'bar',
                            data: [],
                        }],
                    };
                    alert(res.meta.message);
                    updateOption(option);
                }

            }

        });
    }

</script>





